-
-
Notifications
You must be signed in to change notification settings - Fork 32.4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Icons] Misc fixes and optimizations #12036
Conversation
@@ -2,5 +2,5 @@ import React from 'react'; | |||
import createSvgIcon from './utils/createSvgIcon'; | |||
|
|||
export default createSvgIcon( | |||
<g><g><path d="M6 22h12l-6-6z" /><path d="M21 3H3c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h4v-2H3V5h18v12h-4v2h4c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z" /></g> | |||
<><g fill="none"></g><path d="M6 22h12l-6-6z" /><path d="M21 3H3c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h4v-2H3V5h18v12h-4v2h4c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z" /></> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks wrong 🙂
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It does, but it isn't: https://reactjs.org/docs/fragments.html
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I would vote for using React.Fragment
, it's more explicit.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@mbrookes thank you for pointing that out 🙂
@@ -2,5 +2,5 @@ import React from 'react'; | |||
import createSvgIcon from './utils/createSvgIcon'; | |||
|
|||
export default createSvgIcon( | |||
<g><path d="M17.337 1.811l4.607 3.844-1.281 1.535-4.608-3.843zM6.663 1.81l1.282 1.536L3.337 7.19 2.056 5.654zM12 4a9 9 0 1 0 .001 18.001A9 9 0 0 0 12 4zm0 16c-3.86 0-7-3.14-7-7s3.14-7 7-7 7 3.14 7 7-3.14 7-7 7z" /><path d="M13 9h-2v3H8v2h3v3h2v-3h3v-2h-3z" /></g> | |||
<><g><path d="M17.337 1.811l4.607 3.844-1.281 1.535-4.608-3.843zM6.663 1.81l1.282 1.536L3.337 7.19 2.056 5.654zM12 4a9 9 0 1 0 .001 18.001A9 9 0 0 0 12 4zm0 16c-3.86 0-7-3.14-7-7s3.14-7 7-7 7 3.14 7 7-3.14 7-7 7z" /><path d="M13 9h-2v3H8v2h3v3h2v-3h3v-2h-3z" /></g></> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
And in other files
@mbrookes , @oliviertassinari, @kybarg I hope this will reduce the import pain of multiple icons and we also don't want to maintain a huge list of files for all the icons (currently for one icon we have 5 files). Please correct if I am wrong. |
@ranjithprabhuk Since users would typically only be using one theme, putting all 5 themes in one icon would both bloat the components while failing to reduce the number of imports. |
* [Icons] Misc fixes and optimizations * Use explicit React.Fragment so as not to cunfuse newbies 😜
<g>
&</g>
<g></g>
in the template.ic_
from the svg filenames.<defs</defs>